<%--
Created by IntelliJ IDEA.
User: 沐白
Date: 2020/8/18
Time: 19:44
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>

	<head>
		<meta charset="UTF-8">
		<title>登录</title>
		<style type="text/css">
			form {
				margin-top: 15%;
				margin-left: 30%;
			}
			body {
				width: 100%;
				height: 100%;
				background-image: url(${pageContext.request.contextPath}/login/img/002.jpg);
				background-repeat: no-repeat;
			}
		</style>
		<script src="${pageContext.request.contextPath}/static/js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="${pageContext.request.contextPath}/static/toastr/toastr.min.js"></script>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/toastr/toastr.min.css"/>
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/bootstrap.min.css">
	</head>

	<body style="overflow: hidden">
		<form class="form-horizontal" action="${pageContext.request.contextPath}/loginServlet" id="loginFrom" method="post">
			<div class="form-group">
				<label class="col-sm-2 control-label">账号:</label>
				<div class="col-sm-3">
					<input type="text" class="form-control" name="user"  placeholder="请输入账号" />
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">密码:</label>
				<div class="col-sm-3">
					<input type="password" class="form-control" name="pass"  placeholder="请输入密码" />
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-4">
					<button type="button" disabled="disabled" id="btn" class="btn btn-default">登录</button>
				</div>
			</div>
		</form>
	</body>
	<script type="text/javascript">
		let flag = true;
		$('[name="user"]').on('blur',function () {
			if(/^[0-9]{8}$/.test($(this).val())){
				flag=false;
			}else{
				toastr.error("账号长度为8位,且只能为数字");
				flag=true;
			}
			$('#btn').get(0).disabled=flag;
		});
		$('[name="user"]').on('input',function () {
			if(/^[0-9]{8}$/.test($(this).val())){
				flag=false;
			}else{
				flag=true;
			}
			$('#btn').get(0).disabled=flag;
		});
		$('#btn').click(function () {
			$.post(
					"/loginServlet",
					{user:$('[name="user"]').val(),pass:$('[name="pass"]').val()},
					function (data) {
						if(data!=0){
							window.location.href='/homeServlet/showPower';
						}else{
							toastr.error("用户名或密码错误");
						}
					},
					"json"
			);
		})
	</script>
</html>